<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
        //ducument
        //1.动态地获取网页中所有的节点
        //2.可以动态地对节点进行CRUD增删改查(CRUD是指在做计算处理时的增加(Create)、读取(Retrieve)（重新得到数据）、更新(Update)和删除(Delete)几个单词的首字母简写。主要被用在描述软件系统中数据库或者持久层的基本操作功能。)
//        document.write('hello world')
//        document.write('<button>百度一下</button>')
//        document.write('<img src = "https://www.baidu.com/img/bd_logo1.png" width="200px">')


        function change(){
//        var img = document.getElementById('icon');
//        var img = document.getElementsByClassName('test1')[0];
//         var img = document.getElementsByName('test2')[0];//根据标签内部属性name
            var img = document.getElementsByTagName('img')[0]


            console.log(img)
          img.src = "img/img_02.jpg"
        }
        
    </script>
</head>
<body>

    <img id="icon"  class="test1" name="test2" T src="img/img_01.jpg">
    <p></p>
    <button onclick="change()">改变图片</button>

</body>
</html>